﻿<!doctype html>
<html>

<head>
  <meta charset="utf-8">

  <title>二手房大数据分析</title>
  <link rel="icon" href="images/logo.png" type="image/x-icon">
  <link rel="shortcut icon" href="images/logo.png" type="image/x-icon">
</head>

<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/echarts.min.js"></script>
<script type="text/javascript" src="js/js.js"></script>
<script type="text/javascript" src="js/jquery.limarquee.js"></script>
<script type="text/javascript" src="js/jquery.cxselect.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

<script src="js/echarts_1.js"></script>
<script src="js/echarts_2.js"></script>
<script src="js/echarts_3.js"></script>
<script src="js/echarts_4.js"></script>
<script src="js/echarts_5.js"></script>
<script src="js/echarts_6.js"></script>
<script src="js/echarts_7.js"></script>
<script src="js/echarts_8.js"></script>
<script src="js/echarts_9.js"></script>
<script src="js/echarts_10.js"></script>
<link rel="stylesheet" href="css/comon0.css">
<link rel="stylesheet" href="css/layui.css">

<body>
  <div style="background:#000d4a url(images/bg.jpg) center top;" id="app">
    <div class="loading">
      <div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
    </div>
    <div class="back"></div>
    <div class="head">
      <h1>二手房大数据分析</h1>
      <div class="weather"><span id="showTime"></span></div>
    </div>




    <div class="mainbox">
      <ul class="clearfix">
        <li>
          <div class="boxall" style="height:545px">
            <div class="alltitle">左上-echarts_7</div>
            <div class="navboxall" id="echart7"></div>
          </div>
          
        </li>
        <li>

          <div class="boxall" style="height:545px">
            <div class="alltitle">二手房建造年份</div>
            <div class="navboxall" id="echart4"></div>
          </div>
        </li>

        <li>
          <!-- 左上 -->
          <div class="boxall" style="height:540px">
            <div class="alltitle">房屋类型</div>
            <div class="navboxall" id="echart1"> </div>
          </div>


        </li>
      </ul>

      <ul class="clearfix">
        <li>
          <div class="boxall" style="height:390px;">
            <!-- 左下 -->
            <div class="alltitle">价格排行傍</div>
            <div class="navboxall">
              <div class="wraptit"> <span>地址</span><span>商圈</span><span>辖区</span><span>单价</span> </div>
              <div class="wrap">
                <ul>
                  <li v-for="item in list">
                    <div>
                      <p><span>{{ item.community }}</span><span>{{ item.area }}</span><span>{{ item.region
                          }}</span><span>{{ item.price }}</span></p>
                    </div>
                    <!-- <div class="layui-row">
                    <div class="layui-col-md3">
                      <div class="grid-demo grid-demo-bg1">移动</div>
                    </div>
                    <div class="layui-col-md3">
                      <div class="grid-demo">桌面</div>
                    </div>
                    <div class="layui-col-md3">
                      <div class="grid-demo grid-demo-bg2">桌面</div>
                    </div>
                    <div class="layui-col-md3">
                      <div class="grid-demo grid-demo-bg2">桌面</div>
                    </div>
                  </div> -->

                  </li>


                </ul>
              </div>
            </div>
          </div>
        </li>
        <!-- 中下 -->
        <li style="width:38%">
          <div class="boxall" style="height:390px">
            <div class="alltitle">各区的平均住房价格统计</div>
            <div class="navboxall" id="echart3"></div>
          </div>
        </li>
        <!-- 右下 -->
        <li style="width:38%">
          <div class="boxall" style="height:390px">
            <div class="alltitle">不同年份不同辖区的价格对比</div>
            <div class="navboxall" id="echart5"></div>
          </div>
        </li>
      </ul>
    </div>
  </div>







  <!-- 第二页 -->

  <div style="background:#000d4a url(images/bg.jpg) center top;">
    <div class="loading">
      <div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
    </div>
    <div class="back"></div>
    <div class="head">
      <!-- <h1>二手房大数据分析</h1> -->
      <div class="weather"><span id="showTime"></span></div>
    </div>

    <div class="mainbox">
      <ul class="clearfix">
        <li>

          <div class="boxall" style="height:545px">
            <div class="alltitle">echarts10</div>
            <div class="navboxall" id="echart10"></div>
          </div>




        </li>
        <li>
          <!-- 上中 -->
          <div class="boxall" style="height:545px">
            <div class="alltitle">二手房数量分布</div>
            <div class="navboxall" id="echart2"></div>
          </div>
        </li>

        <li>
          <!-- 上右 -->
          <div class="boxall" style="height:545px">
            <div class="alltitle">echart6 - 不同年份房屋价格的统计</div>
            <div class="navboxall" id="echart6"> </div>
          </div>


        </li>
      </ul>

      <ul class="clearfix">
        <li>
          <div class="boxall" style="height:390px;">
            <!-- 左下 -->


              <div class="alltitle">价格排行傍</div>
              <div class="navboxall">
                <div class="wraptit"> <span>学号</span><span>姓名</span><span>职务</span><span>负责</span> </div>
                <div class="wrap">
                  <ul>
                    <li >
                      <div>
                        <p><span>201803161210</span><span>邓龙</span><span>组长</span><span>后端</span></p>
                      </div>
          
  
                    </li>
                    <li >
                      <div>
                        <p><span>201803161207</span><span>张航</span><span>组员</span><span>爬虫</span></p>
                      </div>
          
  
                    </li>
  
                    <li >
                      <div>
                        <p><span>201708030304</span><span>王斌</span><span>组员</span><span>前端</span></p>
                      </div>
          
  
                    </li>
  
                    <li >
                      <div>
                        <p><span>特别鸣谢</span><span>邓琪</span><span>--</span><span>--</span></p>
                      </div>
          
  
                    </li>
  
  
  
                  </ul>
              
          </div>
        </li>
        <!-- 下中 -->
        <li style="width:38%">
          <div class="boxall" style="height:390px">
            <div class="alltitle">人口密度与住房价格对比</div>
            <div class="navboxall" id="echart8"></div>
          </div>
        </li>
        <li style="width:38%">
          <div class="boxall" style="height:390px">
            <!-- 下右  -->
            <div class="alltitle">不同商圈的住房数量</div>
            <div class="navboxall" id="echart9"></div>
          </div>
        </li>
      </ul>
    </div>
  </div>




  <!-- footer -->
  <div class="nav">
    <ul>
      <li>
        <a href="#"><span></span><span>&nbsp;</span></a>
      </li>
      <li style="position:relative;">
        <a href="#"><span></span><span>&nbsp;</span></a>
      </li>
      <li>
        <a href="#"><span></span><span>这是我的底线</span></a>
      </li>
      <li>
        <a href="#"><span></span><span>&nbsp;</span></a>
      </li>
      <li>
        <a href="#"><span></span><span>&nbsp;</span></a>
      </li>
    </ul>
  </div>

  <script>
    $(function () {
      $('.wrap').liMarquee({
        direction: 'up',//身上滚动 
        //runshort: false,//内容不足时不滚动
        scrollamount: 20//速度
      });
    });
  </script>
  <script type="text/javascript" src="js/echarts_.js"></script>
</html>